<!DOCTYPE html>
<html
	lang="en">

<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="">
<meta name="author" content="">
<link rel="shortcut icon" href="assets/img/favicon.ico">
<link rel="stylesheet" href="assets/css/style.css">
<title>Event Afghanistan</title>

<!-- Bootstrap core CSS -->
<link href="assets/css/bootstrap.css" rel="stylesheet">

<!-- Custom styles for this template -->
<link href='http://fonts.googleapis.com/css?family=Lato:100,300,400'
	rel='stylesheet' type='text/css'>
<link rel="stylesheet" type="text/css" href="assets/css/animate.css" />
<link rel="stylesheet" type="text/css" href="assets/css/elements.css" />
<link rel="stylesheet" type="text/css" href="assets/css/custom.css" />
<link
	href="http://netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.css"
	rel="stylesheet">

<!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
<!--[if lt IE 9]>
	  <script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
	  <script src="https://oss.maxcdn.com/libs/respond.js/1.3.0/respond.min.js"></script>
    <![endif]-->
<!--[if IE]>
	<style>
		.showcase {
			 zoom: 0.6;
		}
	</style>
	<![endif]-->
</head>

<body>

	<!-- Navbar
	============= -->
	<div class="navbar navbar-inverse navbar-fixed-top">
		<div class="container">
			<div class="navbar-header">
				<button type="button" class="navbar-toggle" data-toggle="collapse"
					data-target=".navbar-collapse">
					<span class="icon-bar"></span> <span class="icon-bar"></span> <span
						class="icon-bar"></span>
				</button>
				<a class="navbar-brand" href="index.php">Events </a>
			</div>
			<div class="collapse navbar-collapse">
				<ul class="nav navbar-nav">
					<li class="hidden-sm hidden-md"><a href="index.php">Home</a>
					</li>
					<li class="hidden-sm hidden-md"><a href="services.php">Services </a>
					</li>

					<li class="hidden-sm hidden-md"><a href="calendar.php">Event
							Calendar </a>
					</li>
					<li class="hidden-sm hidden-md"><a href="index.php">Voluntering </a>
					</li>
					<li class="hidden-sm hidden-md"><a href="index.php">Resources </a>
					</li>
					<li class="hidden-sm hidden-md"><a href="about-us.php">About</a>
					</li>
					<li class="hidden-sm hidden-md"><a href="contact.php">Contact us</a>
					</li>
					<!-- Profile links for extra small screens -->
					<li class="visible-xs"><a href="sign-in.php">Sign In</a>
					</li>
					<li class="visible-xs"><a href="#">Sign Out</a>
					</li>
				</ul>
				<!-- Search form for extra small screens -->
				<form class="navbar-form navbar-left visible-xs" role="search">
					<div class="form-group">
						<input type="text" class="form-control" placeholder="Search">
					</div>
					<button type="submit" class="hl-btn hl-btn-blue">Go!</button>
				</form>
				<ul class="nav navbar-nav navbar-right hidden-xs">
					<!-- Sign in & Sign up -->
					<li id="sign-up" class="show"><a href="sign-up.php">Sign Up</a>
					</li>
					<li id="login" class="show"><a href="login.php">Sign In</a>
					</li>
					<!-- Signed in. Profile Menu -->

					<!-- Search Button -->
					<li id="search"><a href="#" id="search-btn"><i class="fa fa-search"
							id="search-icon"></i> Search</a>
						<div class="search-box hidden" id="search-box">
							<div class="input-group">
								<input type="text" class="form-control" placeholder="Search"> <span
									class="input-group-btn">
									<button class="hl-btn hl-btn-default" type="button">Go!</button>
								</span>
							</div>
						</div></li>
				</ul>
			</div>
		</div>
	</div>
	<div class="wrapper">
		<div class="section-header">
			<div class="container">
				<div class="row">
					<div class="col-sm-12">
						<!-- Remove the .animated class if you don't want things to move -->
						<h1 class="animated slideInLeft">
							<span>Services</span>
						</h1>
					</div>
				</div>
			</div>
		</div>
		<div class="container">

			<div class="col-md-3">
				<div class="well">
					<ul class="nav nav-pills nav-stacked">
						<li class="active event-li"><a href="#" class="goevent"
							name="event1">Event hosting </a></li>
						<li class="event-li"><a href="#" class="goevent" name="event2">Event
								promotion and advertising </a></li>
						<li class="event-li"><a href="#" class="goevent" name="event3">Event
								fee collection info </a></li>
						<li class="event-li"><a href="#" class="goevent" name="event4">Travel
								and accommodation info </a></li>
					</ul>
				</div>
			</div>



			<div class="col-md-9">

				<div class="well">
					<div id="event1" class="det_event">
						<h2>Event Hosting</h2>
						<p>Events.af hosts your
							physical events online. It is aggregating thousands of events
							through different events that makes it extremely convenient for
							your event attendees to register, reserve tickets, invite friends
							and family, share photos and videos and promote it through social
							media. If you are planning an event, we can help you create your
							event page, register now.</p>
					</div>
					<div id="event2" class="det_event" style="display: none;">
						<h2>Event promotion and advertising</h2>
						<p>Events.af can assist in
							promoting your event online. We help you post and disseminate
							information including your event program, speakers, photos and
							videos and other promotional material. Events.af also spreads the
							word out through social media channels, such as Facebook,
							Twitter, LinkedIn, and Google+, and through email and SMS alter
							systems.</p>
					</div>
					<div id="event3" class="det_event" style="display: none;">
						<h2>Event promotion and advertising</h2>
						<p>Events.af can assist in
							promoting your event online. We help you post and disseminate
							information including your event program, speakers, photos and
							videos and other promotional material. Events.af also spreads the
							word out through social media channels, such as Facebook,
							Twitter, LinkedIn, and Google+, and through email and SMS alter
							systems.</p>
					</div>
					<div id="event4" class="det_event" style="display: none;">
						<h2>Event promotion and advertising</h2>
						<p>Events.af can assist in
							promoting your event online. We help you post and disseminate
							information including your event program, speakers, photos and
							videos and other promotional material. Events.af also spreads the
							word out through social media channels, such as Facebook,
							Twitter, LinkedIn, and Google+, and through email and SMS alter
							systems.</p>
					</div>
				</div>
			</div>
		</div>
	</div>


	<!-- Foooter
================== -->
	<footer>
		<div class="container">
			<div class="row">
				<!-- Contact Us 
		=================  -->
				<div class="col-sm-4">
					<div class="headline">
						<h3>Contact us</h3>
					</div>
					<div class="content">
						<p>
							TechNation <br> Dunya Plaza<br> Shahid Abdul Haq Square <br>
							Ground Floor <br>phone:0093 788 121 311<br /> Email: <a
								href="http://www.technation.af">info@technation.af</a>
						</p>
					</div>
				</div>
				<!-- Social icons 
		===================== -->
				<div class="col-sm-4">
					<div class="headline">
						<h3>Go Social</h3>
					</div>
					<div class="col-md-10">
						<div class="content social">
							<p>Stay in touch with us:</p>
							<ul>
								<li><a href="#"><i class="fa fa-twitter"></i> </a></li>
								<li><a href="#"><i class="fa fa-facebook"></i> </a></li>
								<li><a href="#"><i class="fa fa-pinterest"></i> </a></li>
								<li><a href="#"><i class="fa fa-youtube"></i> </a></li>
								<li><a href="#"><i class="fa fa-linkedin"></i> </a></li>
								<li><a href="#"><i class="fa fa-google-plus"></i> </a></li>
							</ul>
							<div class="clearfix"></div>
						</div>
						<h5>Message Alert</h5>
						<div class="input-group">
							<label class="sr-only" for="subscribe-email"> </label> <span
								class="input-group-addon"><img src="assets/img/flag.jpg"> </span>
							<input type="text" class="form-control" id="phone"
								placeholder="your phone Number"> <span class="input-group-btn">
								<button type="submit" class="hl-btn hl-btn-default">send</button>
							</span>
						</div>
					</div>
				</div>
				<!-- Subscribe 
		=============== -->
				<div class="col-sm-4">
					<div class="headline">
						<h3>Subscribe</h3>
					</div>
					<div class="content">
						<p>
							Enter your e-mail below to subscribe to our free newsletter.<br />We
							promise not to bother you often!
						</p>
						<form class="form" role="form">
							<div class="row">
								<div class="col-sm-8">

									<input type="text" class="form-control" id="name"
										placeholder="Enter your Name">


									<div class="clearfix"></div>
									<br>

									<div class="input-group">
										<label class="sr-only" for="subscribe-email">Email address</label>
										<input type="email" class="form-control" id="subscribe-email"
											placeholder="Enter email"> <span class="input-group-btn">
											<button type="submit" class="hl-btn hl-btn-default">OK</button>
										</span>
									</div>
								</div>
							</div>
						</form>
					</div>
				</div>

			</div>
		</div>
	</footer>
	<!-- Legal 
  ============= -->
	<div class="legal">
		<div class="container">
			<div class="row">
				<div class="col-sm-12">
					<p>
						&copy; The Events 2014. <a href="#">Privacy Policy</a> | <a
							href="#">Terms of Service</a>
					</p>
				</div>
			</div>
		</div>
	</div>

	<!-- Bootstrap core JavaScript
    ================================================== -->
	<!-- Placed at the end of the document so the pages load faster -->
	<script src="http://code.jquery.com/jquery-1.10.2.min.js"></script>
	<script src="assets/js/bootstrap.min.js"></script>
	<script src="assets/js/custom.js"></script>
	<script src="assets/js/scrolltopcontrol.js"></script>
	<!-- Scroll to top javascript -->

	<script>
	$(function(){
		$(".goevent").on("click",function(){
			var id = $(this).attr("name");
			$(".event-li").attr("class","event-li");
			$(this).parent().attr("class","event-li active");

			$(".det_event").hide();
			$("#"+id).css("display","block");
		});
	});
	</script>
</body>

<!-- Mirrored from 7.pdvop2sz.z8.ru/highland/1.3/ by HTTrack Website Copier/3.x [XR&CO'2013], Mon, 27 Jan 2014 06:12:43 GMT -->
</html>
